<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>后台管理系统</title>
    <style>
        body { margin:0; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background:#f5f7fa; }
        .sidebar {
            width: 220px; background: #5a4e9a; color: white; height: 100vh; position: fixed;
            display: flex; flex-direction: column;
        }
        .sidebar a {
            color: white; text-decoration: none; padding: 15px 20px; display: block;
            border-left: 4px solid transparent;
        }
        .sidebar a:hover, .sidebar a.active {
            background: #7a6ccc; border-left: 4px solid #d3c9ff;
        }
        .header {
            margin-left: 220px; height: 60px; background: white; box-shadow: 0 2px 8px rgb(0 0 0 / 0.1);
            display: flex; align-items: center; justify-content: flex-end; padding: 0 20px;
        }
        .header a {
            color: #5a4e9a; text-decoration: none; font-weight: 600;
        }
        .content {
            margin-left: 220px; padding: 20px; min-height: calc(100vh - 60px);
        }
        h1 { color: #5a4e9a; }
        table {
            width: 100%; border-collapse: collapse; background: white; border-radius: 8px; overflow: hidden;
        }
        th, td {
            padding: 12px 15px; border-bottom: 1px solid #ddd; text-align: left;
        }
        th {
            background: #7a6ccc; color: white;
        }
        tr:hover {
            background: #f3f1ff;
        }
        button {
            background: linear-gradient(135deg, #a188ff, #7a6ccc);
            border: none; color: white; padding: 6px 12px; border-radius: 6px;
            cursor: pointer;
            transition: background 0.3s ease;
        }
        button:hover {
            background: linear-gradient(135deg, #c2b7ff, #9587d7);
        }
        input[type=text], input[type=number], select {
            padding: 8px 10px; border-radius: 6px; border: 1px solid #ccc; width: 100%;
            box-sizing: border-box;
            margin-top: 6px; margin-bottom: 16px;
        }
        label {
            font-weight: 600; color: #555;
        }
        .form-group {
            margin-bottom: 20px;
        }
        .actions {
            margin-top: 20px;
        }
    </style>
</head>
<body>
<div class="sidebar">
    <h2 style="text-align:center; margin:20px 0; font-weight:700;">后台管理</h2>
    <a href="${pageContext.request.contextPath}/admin/product/list" class="<%= request.getRequestURI().contains("/admin/product") ? "active" : "" %>">商品管理</a>
    <a href="${pageContext.request.contextPath}/admin/category/list" class="<%= request.getRequestURI().contains("/admin/category") ? "active" : "" %>">分类管理</a>
    <a href="${pageContext.request.contextPath}/admin/group/list" class="<%= request.getRequestURI().contains("/admin/group") ? "active" : "" %>">拼团活动管理</a>
    <a href="${pageContext.request.contextPath}/admin/order/list" class="<%= request.getRequestURI().contains("/admin/order") ? "active" : "" %>">订单管理</a>
</div>

<!-- ✅ 添加 content 容器 -->
<div class="content">
    <h1>新增商品</h1>
    <form action="${pageContext.request.contextPath}/admin/product/add" method="post">
        <div class="form-group">
            <label>商品名称</label>
            <input type="text" name="name" required />
        </div>
        <div class="form-group">
            <label>描述</label>
            <input type="text" name="description" />
        </div>
        <div class="form-group">
            <label>价格</label>
            <input type="number" name="price" step="0.01" min="0" required />
        </div>
        <div class="form-group">
            <label>库存</label>
            <input type="number" name="stock" min="0" required />
        </div>
        <div class="form-group">
            <label>图片URL</label>
            <input type="text" name="imageUrl" />
        </div>
        <div class="form-group">
            <label>商品分类</label>
            <select name="categoryId" required>
                <c:forEach items="${categoryList}" var="cat">
                    <option value="${cat.id}">${cat.name}</option>
                </c:forEach>
            </select>
        </div>
        <div class="form-group">
            <label>状态</label>
            <select name="status">
                <option value="1" selected>上架</option>
                <option value="0">下架</option>
            </select>
        </div>
        <div class="actions">
            <button type="submit">保存</button>
            <a href="${pageContext.request.contextPath}/admin/product/list"><button type="button">取消</button></a>
        </div>
    </form>
</div>
</body>
</html>